<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>账户信息</title>
		<link href="../../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../../css/app.css" />
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"><span>返回</span></a>
			<h1 class="mui-title" id="title">账户信息</h1>
		</header>
		<div class="mui-content">
			<ul class="mui-table-view  mui-table-view-chevron" style="margin-top: 15px;">
				<li class="mui-table-view-cell">
					<a id="head" class="mui-navigate-right">
						<img class="mui-media-object mui-pull-right head-img" id="user-head" style="width: 60px;height: 60px;max-width: 80px;border-radius: 50%;" src="../../images/defaultHead.png">
						<div style="line-height: 60px;">头像</div>
					</a>
				</li>
			</ul>
			<ul class="mui-table-view mui-table-view-chevron" style="margin-top: 15px;">
				<li class="mui-table-view-cell forbidden">
					<a>
						用户名<i class="mui-pull-right chevron-update" id="user-telephone"></i>
					</a>
				</li>
			</ul>
			<ul class="mui-table-view mui-table-view-chevron" style="margin-top: 15px;">
				<li class="mui-table-view-cell emailforbidden">
					<a>
						邮箱<i class="mui-pull-right chevron-update" id="user-email"></i>
					</a>
				</li>
			</ul>
			<ul class="mui-table-view mui-table-view-chevron" style="margin-top: 15px;">
				<li class="mui-table-view-cell edit-rep-info" data-tag='Username' data-title='昵称' url='editUserInfo.html'>
					<a class="mui-navigate-right">
						昵称<i class="mui-pull-right chevron-update" id="user-nickname"></i>
					</a>
				</li>
			</ul>
			<!--<ul class="mui-table-view mui-table-view-chevron" style="margin-top: 15px;">
				<li class="mui-table-view-cell edit-rep-info" data-tag='gender' data-title='性别' url='editUserInfo.html'>
					<a class="mui-navigate-right">
						性别<i class="mui-pull-right chevron-update" id="user-gender"></i>
					</a>
				</li>
			</ul>-->
			<ul class="mui-table-view mui-table-view-chevron" style="margin-top: 15px;">
				<li class="mui-table-view-cell edit-rep-info" data-tag='Signature' data-title='签名' url='editUserInfo.html'>
					<a class="mui-navigate-right">
						签名<i class="mui-pull-right chevron-update" id="user-signature"></i>
					</a>
				</li>
			</ul>
			<ul class="mui-table-view mui-table-view-chevron" style="margin-top: 15px;">
				<li class="mui-table-view-cell edit-rep-info" data-tag='School' data-title='学校' url='editUserInfo.html'>
					<a class="mui-navigate-right">
						学校<i class="mui-pull-right chevron-update" id="user-school"></i>
					</a>
				</li>
			</ul>
			<ul class="mui-table-view mui-table-view-chevron" style="margin-top: 15px;">
				<li class="mui-table-view-cell edit-rep-info" data-tag='Department' data-title='学院' url='editUserInfo.html'>
					<a class="mui-navigate-right">
						院系<i class="mui-pull-right chevron-update" id="user-department"></i>
					</a>
				</li>
			</ul>
			<ul class="mui-table-view mui-table-view-chevron" style="margin-top: 15px;">
				<li class="mui-table-view-cell edit-rep-info" data-tag='Class' data-title='班级' url='editUserInfo.html'>
					<a class="mui-navigate-right">
						班级<i class="mui-pull-right chevron-update" id="user-class"></i>
					</a>
				</li>
			</ul>
			<ul class="mui-table-view mui-table-view-chevron" style="margin-top: 15px;">
				<li class="mui-table-view-cell edit-rep-info" data-tag='Title' data-title='名片' url='editUserInfo.html'>
					<a class="mui-navigate-right">
						名片<i class="mui-pull-right chevron-update" id="user-title"></i>
					</a>
				</li>
			</ul>
		</div>
		<script src="../../js/mui.min.js"></script>
		<script type="text/javascript" src="../../js/mui-extend.min.js" ></script>
		<script type="text/javascript" src="../../js/app.js"></script>
		<script type="text/javascript" src="../../js/lrz.all.bundle.js"></script>
		<script type="text/javascript" charset="utf-8">
			mui.init();
			mui.plusReady(function() {
				var current = plus.webview.currentWebview();
				var userinfo = persistent.uinfo()
				document.getElementById("user-telephone").innerHTML = userinfo.Telephone;
				document.getElementById("user-email").innerHTML = userinfo.Email;
				document.getElementById("user-nickname").innerHTML = userinfo.Username;
				document.getElementById("user-signature").innerHTML = userinfo.Signature;
				document.getElementById("user-school").innerHTML = userinfo.School;
				document.getElementById("user-department").innerHTML = userinfo.Department;
				document.getElementById("user-class").innerHTML = userinfo.Class;
				document.getElementById("user-title").innerHTML = userinfo.Title;
				if (!tool.isEmptyVal(userinfo.HeadPortrait)) {
					document.getElementById("user-head").src = userinfo.HeadPortrait;
				}
				document.addEventListener('reload', function() {
					var userinfo = persistent.uinfo()
					document.getElementById("user-telephone").innerHTML = userinfo.Telephone;
					document.getElementById("user-email").innerHTML = userinfo.Email;
					document.getElementById("user-nickname").innerHTML = userinfo.Username;
					document.getElementById("user-signature").innerHTML = userinfo.Signature;
					document.getElementById("user-school").innerHTML = userinfo.School;
					document.getElementById("user-department").innerHTML = userinfo.Department;
					document.getElementById("user-class").innerHTML = userinfo.Class;
					document.getElementById("user-title").innerHTML = userinfo.Title;
					if (!tool.isEmptyVal(userinfo.HeadPortrait)) {
						document.getElementById("user-head").src = userinfo.HeadPortrait;
					}
				});
				mui(".mui-table-view").on("tap", ".forbidden", function(e) {
					mui.alert("您无法更新该属性", "学园");
				});
				mui(".mui-table-view").on("tap", ".emailforbidden", function(e) {
					mui.alert("邮箱属于敏感信息，请登录网站修改", "学园");
				});
				mui('.mui-table-view').on('tap', '.edit-rep-info', function() {
					var ur = this.getAttribute('url');
					var id = this.dataset['tag'];
					var title = this.dataset['title'];
					var attribute = this.dataset['tag'];
					var value = this.querySelector('i').innerHTML;
					if (tool.isEmptyVal(ur) || tool.isEmptyVal(id)) return;
					openPage(ur, id, {
						title: title,
						value: value,
						attribute: attribute
					});
				});
				//更换头像
				mui(".mui-table-view-cell").on("tap", "#head", function(e) {
					var btnArray = [{
						title: "从相册选取"
					}, {
						title: "照相机"
					}];
					plus.nativeUI.actionSheet({
						title: "设置头像",
						cancel: "取消",
						buttons: btnArray
					}, function(e) {
						var index = e.index;
						switch (index) {
							case 0:
								break;
							case 1:
								//相册
								getGallery();
								break;
							case 2:
								//拍照
								getImage();
								break;
						}
					});
				});
				// 从相册添加文件 
				function getGallery() {
					plus.gallery.pick(function(path) {
						appendFile(path);
					});
				};
				// 拍照添加文件
				function getImage() {
					var cmr = plus.camera.getCamera();
					cmr.captureImage(function(p) {
						plus.io.resolveLocalFileSystemURL(p, function(entry) {
							var localurl = entry.toLocalURL();
							appendFile(localurl);
						});
					}, function(error) {
						console.log("照片添加失败: " + error.message);
					});
				};

				function appendFile(path) {
					plus.nativeUI.showWaiting();
					lrz(path, {
							width: 150
						})
						.then(function(rst) {
							var r64=rst.base64;
							var img = document.getElementById("user-head");
							//console.log(r64);
							// 压缩成功，上传图片
							user.updateheadportrait(r64, function(data) {
								// 更新界面(所有关联界面)
								var userinfo = persistent.uinfo();
								console.log(data.HeadPortrait);
								userinfo['HeadPortrait'] = data.HeadPortrait;
								cache('uinfo', JSON.stringify(userinfo));
								img.src = userinfo.HeadPortrait;
								mui.fire(plus.webview.getWebviewById('mycenter.html'), 'reload', {});
								// toast通知
								plus.nativeUI.toast('头像更新成功');
							});
						})
						.catch(function(err) {
							console.log(err);
						})
						.always(function() {
							plus.nativeUI.closeWaiting();
						});
				};
				showPage(current);
			});
		</script>
	</body>

</html>